<!-- toaster directive -->
<toaster-container toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>
<div class="bg-white bread-crumb">
    <ul class="breadcrumb b-a m-b-n-xs lter b-b wrapper-md">
        <li><a ui-sref="main.tpl.homePage"><i class="fa fa-home"></i> 首页</a></li>
        <li><a ui-sref="main.sys.role.list">角色管理</a></li>
        <li class="active" ng-bind="title"></li>
    </ul>
</div>
<!-- Nested node template -->
<script type="text/ng-template" id="nodes_renderer.html">
  <div class="tree-node tree-node-content" style="width:1000px;">
	<li ng-if="menu.leaf==0">
    <a class="btn btn-success btn-xs"  data-nodrag ng-click="toggle(this)"><span
        class="glyphicon"
        ng-class="{
          'glyphicon-chevron-right': collapsed,
          'glyphicon-chevron-down': !collapsed
        }"></span></a>
		<a><span>&nbsp;&nbsp;</span>{{menu.menuName}}</a>
	</li>
	<li ng-if="menu.leaf==1">
		<a><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;●&nbsp;</span>{{menu.menuName}}</a>
		<ul ng-if="menu.leaf==1" class="menuList">
    	<!--<input type="checkbox" name="menuId" ng-if="menu.leaf==1" value="{{menu.id}}|read" ng-checked="menu.flag.includes('read')"
			ng-disabled="false"/>查询
		<input type="checkbox" name="menuId" ng-if="menu.leaf==1" value="{{menu.id}}|add" ng-checked="menu.flag.includes('add')" 
			ng-disabled="false"/>添加
		<input type="checkbox" name="menuId" ng-if="menu.leaf==1" value="{{menu.id}}|update" ng-checked="menu.flag.includes('update')" 
			ng-disabled="false"/>修改
		<input type="checkbox" name="menuId" ng-if="menu.leaf==1" value="{{menu.id}}|delete" ng-checked="menu.flag.includes('delete')" 
			ng-disabled="false"/>删除-->
            <li ng-repeat="menubtn in menu.menuBtnBeans">
            <input type="checkbox" name="menuId"  value="{{menubtn.menuId}}|{{menubtn.permission}}" ng-checked="{{menubtn.flag}}"
                   ng-disabled="false"/>{{menubtn.btnName}}
            </li>

		</ul>
	</li>
  </div>
  <div>
  <ol ui-tree-nodes="" ng-model="menu.menuBeans" ng-class="{hidden: collapsed}">
    <li ng-repeat="menu in menu.menuBeans" ui-tree-node ng-include="'nodes_renderer.html'">
    </li>
  </ol>
</div>
</script>

<!-- 内容区域 -->
<!-- 内容区域 -->
<div class="wrapper-md content">
    <div class="panel panel-default">
        <!-- 头部 -->
        <div class="panel-heading font-bold">{{title}}
        <a class="btn btn-sm btn-icon btn-rounded btn-default pull-right m-t-n-xs" ui-sref="main.sys.role.list"><i class="text-md fa fa-times text-muted"></i></a>
        </div>
        	<!--表单-->
            <div class="panel-body">
                <form class="form-horizontal"  name="user_form" ng-submit="submit()">
                	<div class="form-group">
                        <div class="col-sm-3 col-sm-offset-1">
                            <button type="reset" class="btn btn-default w-xs">重置</button>
                            <button type="submit" class="btn btn-info w-xs m-l-xl" ng-disabled="isDisabled">保存</button>
                        </div>
                    </div>
                    <div class="line line-dashed b-b line-lg pull-in"></div>
                    <div class="form-group">
                    	<div ui-tree id="tree-root" class="col-sm-3 col-sm-offset-1">
					      <ol ui-tree-nodes ng-model="data">
					        <li ng-repeat="menu in data" ui-tree-node ng-include="'nodes_renderer.html'"></li>
					      </ol>
					    </div>
                    </div>
                </form>
            </div>
    </div>
</div>

<style>
    .menuList{
        overflow: hidden;
        margin-bottom: 15px;
        width:500px;
    }
    .menuList li{
        float: left;
        margin: 10px 10px 0 0;
    }
</style>


